<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<%@taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html>
<html>
<head>
<base href="<%=basePath%>">

<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<script type="text/javascript" src="view/jquery/jquery-1.9.1.js"></script>
<script type="text/javascript" src="view/bootstrap/js/bootstrap.js"></script>
<link rel="stylesheet" href="view/bootstrap/css/bootstrap.css">
<link rel="stylesheet" href="view/css/docMan.css">
<link rel="stylesheet" href="view/css/font-awesome.min.css">
<link rel="stylesheet" href="view/css/buttons.css">
<link rel="stylesheet" href="view/toastr/toastr.css">
<script type="text/javascript" src="view/js/docMan.js"></script>
<script type="text/javascript" src="view/toastr/toastr.min.js"></script>
<script type="text/javascript" src="view/js/ajaxfileupload.js"></script>
</head>
<body style="background: #EDEFF0;">
	<div id="main-container" class="container"
		style="height: 100%;width:100%;background: #EDEFF0">

		<div class="row bookList" style="width:100%;padding-left:20px;">

			<s:iterator value="bookPage.result" id="book" status="stu">
				<div class="book" style="width:33%;float: left;margin-top:10px;">
					<div class="book_image" style="float:left;">
						<s:if test="#book.photoName==null">
							<img alt="" class="hand" id="<s:property value="#book.id" />_book"  style="width:96px;height:128px;"
							src="view/images/book.jpg">
						</s:if>
						<s:else>
							<img alt="" class="hand" id="<s:property value="#book.id" />_book"  style="width:96px;height:128px;"
							src="<s:property value="bookPicFtpPre"/><s:property value="#book.id"/>/<s:property value="#book.photoName" /> ">
						</s:else>
					</div>
					<div class="book_info" style="float:left;padding-left:10px;width:66%;">
						<div style="overflow: hidden;width:100%;max-height: 80px;">
							<h4 class="hand" id='<s:property value="#book.id" />_book'>[<span class="order"><s:property value="#book.orderId" /></span>]<s:property value="#book.bookName" /></h4>
						</div>
						<div style="margin-top:20px;">
							<p><s:date format="yyyy-MM-dd" name="#book.createTime" />
							<p>
							<s:if test="#session.admin==true">
								<button class="btn btn-link btn_bookEdit" name='<s:property value="#book.bookName" />' id='<s:property value="#book.id" />'>编辑</button>
								<button class="btn btn-link btn_bookDel" name='<s:property value="#book.bookName" />' id='<s:property value="#book.id" />' >删除</button>
							</s:if>
						</div>
					</div>
				</div>
			</s:iterator>
		</div>
		<!--分页按钮  -->
		<div class="row" style="margin-top: 20px;margin-bottom: 20px;">
			<form id="gwllForm" name="gwllForm" action="gwllSearch.action"
				method="get">
				<button class="btn btn-link prePage"
					<s:if test='bookPage.hasPrePage==false' >disabled="disabled"</s:if>>上一页</button>
				<input type="number" formtarget="gwllForm"
					onkeydown='if(event.keyCode==13){gosubmit();}' form="gwllForm"
					id="currentPage" name="bookPage.currentPage"
					value='<s:property value="bookPage.currentPage" />'
					style="width:80px;display: inline;" class="form-control">
				<%-- <input type="number" id="currentPage" name="bookPage.currentPage" value='<s:property value="bookPage.currentPage"/>' style="display: none;"> --%>
				<input id="totalPage"
					value='<s:property value="bookPage.totalPage" />'
					style="display: none;">
				<button class="btn btn-link nextPage" type="button"
					<s:if test='bookPage.hasNextPage==false' >disabled="disabled"</s:if>>下一页</button>
				共<span class="pageCount"><s:property
						value="bookPage.totalPage" /> </span>页，
				<s:property value="bookPage.totalCount" />
				条记录 <input type="hidden" id="orderByTimeField"
					name="bookPage.orderByTime"
					value='<s:property value="bookPage.orderByTime" />'> <input
					type="hidden" id="isqtlwdw" name="isqtlwdw"
					value='<s:property value="isqtlwdw" />'> <input
					type="hidden" id="qtlwdw" name="qtLwdw"
					value='<s:property value="qtLwdw" />'>
					<s:if test="#session.admin==true">
						<button class="btn btn-primary" type="button" id="btn_addBookModal" style="margin-left:20px;">添加书本</button>
					</s:if>
			</form>
		</div>
	</div>

	<!--文件收藏的modal	  -->

	<div class="modal fade" id="addBookModal" tabindex="-1" role="dialog"
		aria-labelledby="exampleModalLabel">
		<div class="modal-dialog" role="document" >
			<form >
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-label="Close">
							<span aria-hidden="true">&times;</span>
						</button>
						<h4 class="modal-title" id="boolTitle">新建书本</h4>
					</div>
					<div class="modal-body">
						<div class="form-group">
							<label for="directoryName" class="control-label">目录的排序序号:</label>
							<input type="number" class="form-control" id="orderId" placeholder="目录的排序序号"  >
						</div>
						<div class="form-group">
							<label for="bookName" class="control-label">书本名:</label> <input
								type="text" class="form-control" id="bookName">
						</div>
						<input type="file" name="oafile" id="upFileImage" onchange="uploadfileImage();" style="height: 0px;width: 0px;">
						<input type="file" name="oafile" id="upFile" onchange="uploadfile();" style="height: 0px;width: 0px;">
						<div class="row ">
							<div class="col-xs-2" >
								<div style="float: right">
									<span style="color:red;" >* </span>封面：
								</div>
							</div>
							<div  class="col-xs-9">
								<div id="fileUploadListImage" class="">
								</div>
								<div class="row">
									<i class="commpic-attach"></i>
									<button id="" onclick="clickinputImage();" type="button" class="btn btn-link">上传封面</button>
								</div>
								<div class="form-group">
									<!-- <label for="bookName" class="control-label">书本目录名:</label> <input
										type="text" class="form-control" id="bookSonName" style="width:350px;" id="bookName"> -->
								</div>
							</div>
						</div>
						<div class="row ">
							<div class="col-xs-2" >
								<div style="float: right">
									<span style="color:red;" >* </span>文件：
								</div>
							</div>
							<div  class="col-xs-9">
								<div id="fileUploadList" class="">
								</div>
								<div class="row">
									<i class="commpic-attach"></i>
									<button id="" onclick="clickinput();" type="button" class="btn btn-link">上传书本文件</button>
								</div>
								<div class="form-group">
									<!-- <label for="bookName" class="control-label">书本目录名:</label> <input
										type="text" class="form-control" id="bookSonName" style="width:350px;" id="bookName"> -->
								</div>
							</div>
						</div>
					</div>
					<div class="modal-footer">
						<button type="button" id="btn_addBook" class="btn btn-primary">添加</button>
						<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
					</div>
				</div>
			</form>
		</div>
	</div>
	<!--书本编辑  -->
	<div class="modal fade" id="addBookModal" tabindex="-1" role="dialog"
		aria-labelledby="exampleModalLabel">
		<div class="modal-dialog" role="document" >
			<form >
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-label="Close">
							<span aria-hidden="true">&times;</span>
						</button>
						<h4 class="modal-title" id="boolTitle">编辑书本</h4>
					</div>
					<div class="modal-body">
						<div class="form-group">
							<label for="directoryName" class="control-label">目录的排序序号:</label>
							<input type="number" class="form-control" id="orderId" placeholder="目录的排序序号"  >
						</div>
						<div class="form-group">
							<label for="bookName" class="control-label">书本名:</label> <input
								type="text" class="form-control" id="bookName">
						</div>
						<input type="file" name="oafile" id="upFileImage" onchange="uploadfileImage();" style="height: 0px;width: 0px;">
						<input type="file" name="oafile" id="upFile" onchange="uploadfile();" style="height: 0px;width: 0px;">
						<div class="row ">
							<div class="col-xs-2" >
								<div style="float: right">
									<span style="color:red;" >* </span>封面：
								</div>
							</div>
							<div  class="col-xs-9">
								<div id="fileUploadListImage" class="">
								</div>
								<div class="row">
									<i class="commpic-attach"></i>
									<button id="" onclick="clickinputImage();" type="button" class="btn btn-link">上传封面</button>
								</div>
								<div class="form-group">
									<!-- <label for="bookName" class="control-label">书本目录名:</label> <input
										type="text" class="form-control" id="bookSonName" style="width:350px;" id="bookName"> -->
								</div>
							</div>
						</div>
						<div class="row ">
							<div class="col-xs-2" >
								<div style="float: right">
									<span style="color:red;" >* </span>文件：
								</div>
							</div>
							<div  class="col-xs-9">
								<div id="fileUploadList" class="">
								</div>
								<div class="row">
									<i class="commpic-attach"></i>
									<button id="" onclick="clickinput();" type="button" class="btn btn-link">上传书本文件</button>
								</div>
								<div class="form-group">
									<!-- <label for="bookName" class="control-label">书本目录名:</label> <input
										type="text" class="form-control" id="bookSonName" style="width:350px;" id="bookName"> -->
								</div>
							</div>
						</div>
					</div>
					<div class="modal-footer">
						<button type="button" id="btn_addBook" class="btn btn-primary">添加</button>
						<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
					</div>
				</div>
			</form>
		</div>
	</div>
	<div class="modal fade" id="bookSonModal" tabindex="-1" role="dialog"
		aria-labelledby="exampleModalLabel">
		<div class="modal-dialog" role="document" style="min-height:50%;width:60%;">
			<form >
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-label="Close">
							<span aria-hidden="true">&times;</span>
						</button>
						<h4 class="modal-title" id="boolTitle">书本目录</h4>
					</div>
					<div class="modal-body" style="min-height: 600px;">
						 <iframe id="bookSonIframe" name="" src="" style="overflow:visible;"
                    scrolling="yes" frameborder="no" width="100%" height="100%;"></iframe>
					</div>
					<div class="modal-footer">
						<!-- <button type="button" id="btn_addBook" class="btn btn-primary">添加</button> -->
						<button type="button" class="btn btn-primary" data-dismiss="modal">返回</button>
					</div>
				</div>
			</form>
		</div>
	</div>
	<div id="pfdModal" class="modal fade">
					<div class="modal-dialog">
						<div class="modal-content">
							<div class="modal-body">
								<iframe id="pdfIframe" name="pdfIframe"  contextmenu="return false"
									scrolling="yes" src=""
									style="width:100%;height: 100%;@media print{ body{display:none} } ">
								</iframe>
							</div>
							<div class="">
								<div class="row">
									<div class="" style="margin-left:45%;">
										<!-- <button type="button" class="btn btn-primary"
											data-dismiss="modal">返回</button> -->
											<button type="button"  data-dismiss="modal" class="btn btn-primary"
											>返回</button>
										<!-- <button type="button" class="btn btn-danger print"
											>打印</button> -->
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				
				<div class="modal fade" id="delBookModal" tabindex="-1" role="dialog"
					aria-labelledby="exampleModalLabel">
					<div class="modal-dialog" role="document">
						<form >
							<div class="modal-content">
								<div class="modal-header">
									<button type="button" class="close" data-dismiss="modal"
										aria-label="Close">
										<span aria-hidden="true">&times;</span>
									</button>
									<h4 class="modal-title" id="boolTitle">删除书本</h4>
								</div>
								<div class="modal-body">
									书本名:<span id="delBookName"></span>
									<input type="hidden" id="delBookId" value="" >
								</div>
								<div class="modal-footer">
									<button type="button" id="btn_delBook" class="btn btn-primary">删除</button>
									<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
								</div>
							</div>
						</form>
					</div>
				</div>
				<input type="hidden" id="ftpPre" value='<s:property value="bookPicFtpPre" />'>
				<input type="hidden" id="bookId" >
</body>

<script type="text/javascript">
	var height = getWindowHieght() * 0.9;
	var width = getWindowWidth() * 0.6;
	$("#pdfModal").css("height", height);
	$("#pdfModal").css("width", width);
	$("#pdf").css("height", height);
	$("#pdf").css("width", width * 0.98);
	$("#closePdf").on("click", function() {
		$("#pdfModal").toggle(400);
	});
	$("#btn_editBook_save").on("click",function(){
		var bookName=$("#editBookName").val();
		var bookId=$("#editBookId").val();
		$.ajax({
			type:"post",
			url:"/DocMan/webService/show/DocBookService/editBook",
			data:{bookId:bookId,bookName:bookName},
			success:function(data){
				refresh();
			},
			error:function(data){
				
			}
		})
	});
	$(".btn_bookEdit").on("click",function(){
		var bookId=$(this).attr("id");
		var bookName=$(this).attr("name");
		var orderId=$("#"+bookId+"_book").find("span").text();
		console.info(orderId);
		$("#bookName").val(bookName);
		$("#orderId").val(orderId);
		$("#bookId").val(bookId);
		$("#addBookModal").modal("show");
	});
	$(".btn_bookDel").on("click",function(){
		var bookId=$(this).attr("id");
		var bookName=$(this).attr("name");
		$("#delBookId").val(bookId);
		$("#delBookName").text(bookName);
		$("#delBookModal").modal("show");		
	});
	$("#btn_delBook").on("click",function(){
		var bookId=$("#delBookId").val();
		$.ajax({
			type:"post",
			url:"/DocMan/webService/show/DocBookService/delBook",
			data:{bookId:bookId},
			success:function(){
				refresh();
			},
			error:function(){
			}
		})
	});
	$(".btn_look_pdf").on("click", function() {
		parent.hideleft();
		var id = $(this).attr("id");
		var url = "/DocMan/dowloadFile.action?indexFrom=1&id=" + id;
		/* $("#pdf").attr("src",url);
		$("#pdfModal").toggle(400); */
		var height = $(window).height();
		var width = $(window).width();
		var pdf = $("#pfdModal");
		$("#pdfIframe").attr('src', url);
		$("#jnmlModal").modal('hide');
		pdf.find(".modal-body").css({
			height : height - 40
		});
		pdf.find(".modal-dialog").css({
			width : width,
			height : height,
			margin : 0
		});
		pdf.modal('show').css({
			width : width,
			height : height
		});
	});
	$("#hidepdf").on("click", function() {
		parent.showleft();
		$("#pfdModal").modal('hide');
	})
	$(".prePage").on("click", function() {
		var pageCount = Number($("#currentPage").val()) - 1;
		$("#currentPage").val(pageCount);
		$("#gwllForm").submit();
	});
	$(".nextPage").on("click", function() {
		var pageCount = Number($("#currentPage").val()) + 1;
		$("#currentPage").val(pageCount);
		console.info($("#currentPage").val());
		$("#gwllForm").submit();
	});
	$("#btn_addBookModal").on("click",function(){
		$("#addBookModal").modal("show");
		
	});
	$("#btn_addBook").on("click",function(){
		var bookName=$("#bookName").val();
		var orderId=$("#orderId").val().trim();
		if(bookName==''||bookName==undefined||bookName==null){
			toast.error("请输入书本的标题", "温馨提示");
			return false;
		}
		var imagefilePathsBtn = $("#fileUploadListImage").find(".filePath");
		var filePathsBtn=$("#fileUploadList").find(".filePath");
		var imagefilePaths = new Array();
		var filePaths=new Array();
		$(imagefilePathsBtn).each(function(i, e) {
			imagefilePaths[i] = e.value;
		});
		$(filePathsBtn).each(function(i, e) {
			filePaths[i] = e.value;
		});
		var bookId=$("#bookId").val();
		if(bookId==null||bookId==undefined||bookId=="")
		{
			bookId=0;
		}
		$.ajax({
			type:"post",
			url:"/DocMan/webService/show/DocBookService/addBook",
			data:{bookName:bookName,bookId:bookId,orderId:orderId,imagefilePaths:imagefilePaths,filePaths:filePaths},
			traditional:true,
			success:function(){
				refresh();
			},
			error:function(){
				refresh();
			}
		})
	});
	$(".bookList").on("click",".hand",function(){
		var bookId=$(this).attr("id");
		bookId=bookId.replace("_book","");
		var url="/DocMan/bookSon.action?bookId="+bookId+"&bookSonPage.currentPage=1";
		$("#bookSonIframe").attr("src",url);
		var height = $(window).height();
		var width = $(window).width();
		$("#bookSonModal").find(".modal-body").css({
			height : height - 130
		});
		$("#bookSonModal").find(".modal-dialog").css({
			width : width,
			height : height,
			margin : 0
		});
		$("#bookSonModal").modal('show').css({
			width : width,
			height : height
		});
	});
	function showPdf(bookSonId){
		//var url="/DocMan/webService/show/DocBookSon/getBookSon/"+bookSonId;
		var url="officeFilePreview.action?bookSonId="+bookSonId;
		var height = $(window).height();
		var width = $(window).width();
		var pdf = $("#pfdModal");
		$("#pdfIframe").attr('src', url);
		$("#jnmlModal").modal('hide');
		pdf.find(".modal-body").css({
			height : height - 40
		});
		pdf.find(".modal-dialog").css({
			width : width,
			height : height,
			margin : 0
		});
		pdf.modal('show').css({
			width : width,
			height : height
		});
	}
	function uploadfile() {
		var name = $("#upFile").val();
		var index = name.lastIndexOf("\\");
		var fileName = name.substring(index + 1, name.length);
		var file = document.getElementById('upFile').files[0];
		var fileSize = "";
		if (file.size > 1024 * 1024)
			fileSize = (Math.round(file.size * 100 / (1024 * 1024)) / 100)
					.toString()
					+ 'MB';
		else
			fileSize = (Math.round(file.size * 100 / 1024) / 100).toString()
					+ 'KB';
		console.info(name + fileSize + fileName);
		$.ajaxFileUpload({
					url : "asynUpload.action",
					secureuri : false,
					fileElementId : 'upFile',
					dataType : 'json',
					success : function(data, status) {
						console.info(data);
						var filePath = data.filePath;
						console.info(filePath);
						var file = "<div class=\"row file\">"
								+ "<div class=\"col-xs-6\">"
								+ "<span class=\"\">"
								+ fileName
								+ "</span>"
								+ "</div>"
								+ "<div class=\"col-xs-4\">"
								+ "<span class=\"muted fileSize \" id=\""+fileSize+"\"> ("
								+ fileSize
								+ ") </span>"
								+ "<button value=\""+filePath+"\" class=\"btn btn-link padding_clear filePath\">删除</button>"
								+ "</div>" + "</div>";
						$("#bookSonName").val(fileName);
						$("#fileUploadList").append(file);
						//$("#serverFilePath").val(filePath);
					},
					error : function(data, status) {
						console.info(data);
					}
				});
	}
	function uploadfileImage() {
		var name = $("#upFileImage").val();
		var index = name.lastIndexOf("\\");
		var fileName = name.substring(index + 1, name.length);
		var file = document.getElementById('upFileImage').files[0];
		var fileSize = "";
		if (file.size > 1024 * 1024)
			fileSize = (Math.round(file.size * 100 / (1024 * 1024)) / 100)
					.toString()
					+ 'MB';
		else
			fileSize = (Math.round(file.size * 100 / 1024) / 100).toString()
					+ 'KB';
		console.info(name + fileSize + fileName);
		$.ajaxFileUpload({
					url : "asynUpload.action",
					secureuri : false,
					fileElementId : 'upFileImage',
					dataType : 'json',
					success : function(data, status) {
						console.info(data);
						var filePath = data.filePath;
						console.info(filePath);
						var file = "<div class=\"row file\">"
								+ "<div class=\"col-xs-6\">"
								+ "<span class=\"\">"
								+ fileName
								+ "</span>"
								+ "</div>"
								+ "<div class=\"col-xs-4\">"
								+ "<span class=\"muted fileSize \" id=\""+fileSize+"\"> ("
								+ fileSize
								+ ") </span>"
								+ "<button value=\""+filePath+"\" class=\"btn btn-link padding_clear filePath\">删除</button>"
								+ "</div>" + "</div>";
						$("#bookSonName").val(fileName);
						$("#fileUploadListImage").append(file);
						//$("#serverFilePath").val(filePath);
					},
					error : function(data, status) {
						console.info(data);
					}
				});
	}
	function clickinput() {
		return $("#upFile").click();
	}
	function clickinputImage() {
		return $("#upFileImage").click();
	}
</script>
</html>
